<template>
  <div>
    <div  class="login-wrap">
      <div  class="logo-img">
        <img  src="/static/img/logo_btn.png" alt="">
        <h3 >history</h3>
      </div>
    </div>
    <div  >
        <div  class="fixed-footer">
          <div  style="overflow: hidden;">
            <a  href="/index" class="router-link-active"><i  class="icon iconfont icon-home-fill"></i><span >首页</span></a>
            <a  href="/all" class=""><i  class="icon iconfont icon-find"></i><span >全部</span></a>
            <!-- <a  href="/history" class="router-link-exact-active router-link-active active"><i  class="icon iconfont icon-order"></i><span >历史</span></a> -->
            <a  href="/my" ><i  class="icon iconfont icon-person"></i><span >我的</span></a>
          </div>
        </div>
      </div>
  </div>
</template>

<script>
import { BannerListUrl, TraderListUrl } from "@/api/axiosFun";
export default {
  name: "Index",
  data() {
    return {
      msg: "Welcome to Your Vue.js App",
	  bannerList: [],
	  page:1,
	pageSize:100,
	traderType:"",
	cityId:"",
	orderNum:false,
	Latitude:"",
	Longitude:"",
    };
  },
  mounted() {
    //  this.init();
  },
  methods: {
    init() {
      BannerListUrl().then(res => {
        console.log(res);
        if (res.errCode == 0) {
          this.bannerList = res.data;
        }
      });
      TraderListUrl({
		  page:this.page,
		  pageSize:this.pageSize,
		  traderType:this.traderType,
		  cityId:this.cityId,
		  orderNum:this.orderNum,
		  Latitude:this.Latitude,
		  Longitude:this.Longitude
	  }).then(res => {
        console.log(res);
        if (res.errCode == 0) {
          this.bannerList = res.data;
        }
      });
    }
  }
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>

.login-wrap {
    font-size: .28rem;
    padding: .5rem 1.5rem;
    letter-spacing: .05rem;
}
.login-wrap .logo-img, .login-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-line-pack: center;
    align-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
.login-wrap .logo-img, .login-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-line-pack: center;
    align-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
.login-wrap .logo-img {
    width: 100%;
    padding: 1rem 0;
    border-bottom: 1px solid #ededed;
}
.login-wrap .logo-img img {
    width: 2.2rem;
    height: 2.2rem;
    border-radius: 50%;
}
.login-wrap .logo-img h3 {
    font-size: .42rem;
    font-weight: 700;
    margin-top: .5rem;
}
.login-wrap .login-text {
    width: 100%;
    padding: 1.2rem 0 1.5rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-line-pack: center;
    align-content: center;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
}
.login-wrap .login-text h3 {
    font-weight: 700;
    color: #333;
    padding: 0 0 .5rem;
    font-size: .42rem;
}
.login-wrap .login-text p {
    line-height: 160%;
    color: #999;
    font-size: .38rem;
}
.login-wrap .login-btn {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex-line-pack: center;
    align-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
.login-wrap button {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    padding: 0 .2rem;
    height: 1.2rem;
    border-radius: .6rem;
    border: none;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    letter-spacing: .02rem;
    font-size: .42rem;
}
.login-wrap button.grayBg {
    background-color: #ccc;
    color: #666;
    margin-right: .2rem;
}
.login-wrap button {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    padding: 0 .2rem;
    height: 1.2rem;
    border-radius: .6rem;
    border: none;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    letter-spacing: .02rem;
    font-size: .42rem;
}
.login-wrap button.activeBg {
    background-color: #0085ff;
    color: #fff;
    margin-left: .2rem;
}
</style>
